<script lang="ts" setup>
import { useVbenModal } from '@vben/common-ui';
import { useVbenForm } from '#/adapter/form';
import { updateMaintenance } from '#/api/gis/maintenance';
import type { EditMaintenanceParams } from '#/api/gis/maintenance';
import { message } from 'ant-design-vue';
import { ref, nextTick } from 'vue';
import { z } from '#/adapter/form';


const data = ref();

const [EditModal, EditmodalApi] = useVbenModal({
  onOpenChange(isOpen: boolean) {
    if (isOpen) {
      data.value = EditmodalApi.getData<Record<string, any>>();
      // 确保 BaseForm 渲染完成后再设置初始值
      nextTick(() => {
        setTimeout(() => {
          if (data.value) {
            const plainData = JSON.parse(JSON.stringify(data.value));
            //1.处理备注
            if(plainData.data.remark ==="---"){
              plainData.data.remark = "";
            }
            console.log('plainData:', plainData);

            //设置 BaseForm 的初始值
            BaseFormApi.setValues(plainData.data,false);
            BaseFormApi.getValues().then((values) => {
            console.log(' 获取到的值:', values);
            });

          }
        }, 10); // 延迟 100ms
      });
    };
  }
});

const [BaseForm, BaseFormApi] = useVbenForm({
  commonConfig: {
    componentProps: {
      class: 'w-full',
    },
  },
  handleSubmit: onSubmit,
  layout: 'horizontal',
  schema: [
  {
      component: 'Select',
      componentProps: {
        allowClear: true,
        filterOption: true,
        options: [
          {
            label: '油水井',
            value: '0',
          },
          {
            label: '计量间',
            value: '1',
          },
          {
            label: '转油站',
            value: '2',
          },
          {
            label: '管线',
            value: '3',
          },
          {
            label: '阀池',
            value: '4',
          },
        ],
        placeholder: '请选择维修对象类型',
        showSearch: true,
        disabled: true,
      },
      fieldName: 'type',
      label: '维修对象类型',
      rules: 'selectRequired',

    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入维修对象编号',
        disabled: true,
      },
      fieldName: 'featureCode',
      label: '维修对象编号：',
      rules: "required"

    },
    {
      component: 'Select',
      componentProps: {
        allowClear: true,
        options: [
          {
            label: '1级',
            value: 1,
          },
          {
            label: '2级',
            value: 2,
          },
          {
            label: '3级',
            value: 3,
          },
          {
            label: '4级',
            value: 4,
          },
          {
            label: '5级',
            value: 5,
          },
        ],
        placeholder: '请选择维修等级',
        disabled:true,
      },
      fieldName: 'ranking',
      label: '维修等级：',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入备注',
      },
      fieldName: 'remark',
      label: '备注',
      rules: "required"
    },
  ],
});

// 定义一个自定义事件，用于在修改完数据后刷新页面
const emit = defineEmits(['refreshTable']);
function onSubmit(values: Record<string, any>) {
  const params = values as EditMaintenanceParams;
  updateMaintenance(params).then(() => {
    EditmodalApi.close();
    message.success('修改维修记录成功');
  }).catch((error) => {
    console.error('修改维修记录失败:', error);

  });
  emit('refreshTable'); // 触发自定义事件
}
</script>

<template>
  <EditModal title="修改维修记录">
    <BaseForm />
    <template #prepend-footer>
    </template>
  </EditModal>
</template>
